export default function usePopup<T = any>() {
  const loading = ref(false)
  const visible = ref(false)

  const data = ref<T | undefined>()
  watchEffect(() => {
    if (!visible.value) {
      data.value = undefined
    }
  })

  function open(_data?: T) {
    data.value = _data
    visible.value = true
  }

  function close() {
    visible.value = false
  }

  return {
    loading,
    visible,
    data,
    open,
    close
  }
}
